﻿@using System.Text
@using OA.Model
@using OA.AspNetCore.Html
@using OA.Core.Model
@using OA.Core.Helper

@model List<TestPaperItem>
@{
    Layout = "~/Areas/Member/Views/Shared/_Layout.cshtml";
    TestPaper infoTestPaper = ViewBag.TestPaper;
}
<style type="text/css">

    .TestPaperItem .Sort {
        width: 60px;
        float: left;
    }

    .TestPaperItem .select {
        width: 160px;
        float: left;
    }

    .TestPaperItem .title {
        margin-left: 230px;
    }

    .TestPaperItem textarea {
        margin-top: 4px;
    }

    .TestPaperItem {
        width: 800px;
        float: left;
    }

    .operation {
        margin-left: 10px;
        float: left;
        width: 40px;
        margin-top: 30px;
    }
</style>
<div class="layui-my-content">
    @using (Html.BeginForm(FormMethod.Post, htmlAttributes: new { @class = "layui-form", id = "myForm" }))
    {
        @Html.AntiForgeryToken()
        <div class="layui-form-item">
            <label class="layui-form-label" for="Name">试卷名称</label>
            <div class="layui-input-block" style="width:800px;">
                <input type="text" name="Name" id="Name" disabled class="layui-input" value="@infoTestPaper.Title">
            </div>
        </div>
        <div class="Items">
            @for (int i = 0; i < Model.Count; i++)
            {
                int temp = i + 1;
                TestPaperItem item = Model[i];
                <div class="layui-form-item TestPaperItems" data-id="@i">
                    <label class="layui-form-label">第 @temp 题</label>
                    <div class="TestPaperItem">
                        <div class="layui-input-block" style="margin-left:0px;padding-bottom:4px;">
                            <div style="float:left;width:100%">
                                <div class="Sort"><input type="number" step="1" title="排序" name="TestPaperItems[@i].Sort" class="layui-input" value="@item.Sort" placeholder="排序" /></div>
                                <div class="select">@Html.MyEditorFor(model => item.Type, "TestPaperItems[" + i.ToString() + "].")</div>
                                <div class="title">
                                    <input type="number" name="TestPaperItems[@i].Score" class="layui-input" value="@item.Score" placeholder="分数" style="width:49%;float:left;" title="分数" />
                                    <input type="text" name="TestPaperItems[@i].Answer" class="layui-input" value="@item.Answer" placeholder="答案,多选择题答案以逗号分隔，如:A,B,C" style="width:49%;float:right;" title="答案,多选择题答案以逗号分隔，如:A,B,C" />
                                </div>
                            </div>
                            <div style="margin-top:4px;float:left;clear:both;width:100%">
                                <input type="text" name="TestPaperItems[@i].Title" class="layui-input" value="@item.Title" placeholder="问题" title="问题" />
                            </div>
                            <div style="margin-top:4px;float:left;clear:both;width:100%">
                                <input type="hidden" name="TestPaperItems[@i].Status" class="Status" value="1" />
                                <textarea name="TestPaperItems[@i].ItemContent" class="layui-input" style="height:100px;" placeholder="答案选项，一行一个，自动换行的不算" title="答案选项，一行一个，自动换行的不算">@item.ItemContent</textarea>
                                <textarea name="TestPaperItems[@i].Description" class="layui-input" style="height:100px;" placeholder="试题解析" title="试题解析">@item.Description</textarea>
                            </div>
                        </div>
                    </div>
                    <div class="operation">
                        <button class="layui-btn layui-btn-danger layui-btn-sm deleteItem" title="删除此题"><i class="layui-icon">&#xe640;</i></button>
                    </div>
                </div>
            }
        </div>

        <ul class="layui-fixbar">
            <li class="layui-icon" id="addItem" lay-type="bar1" style="background-color:#009688">&#xe654;</li>
            <li class="layui-icon layui-fixbar-top" lay-type="top" style="background-color: rgb(0, 150, 136); display: list-item;">&#xe604;</li>
        </ul>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="submit" value="提 交" class="layui-btn mySubmit" />
            </div>
        </div>
    }
</div>
<script type="text/javascript">
    layui.use(['form', 'layedit', 'element', 'layer'], function () {
        form = layui.form;
        layer = layui.layer;
        element = layui.element;

    });
    var itemContent = $(".TestPaperItems").first().prop("outerHTML");
    $("#addItem").click(function () {
        var lastID = $(".TestPaperItems").last().attr("data-id");
        var currentIndex = parseInt(lastID) + 1;
        var reg = new RegExp("\\[0]", "g");
        var outerHTML = itemContent;
        outerHTML = outerHTML.replace('data-id="' + lastID + '"', 'data-id="' + currentIndex + '"');
        var dispalyRow = $(".TestPaperItems .Status[value=1]").length;
        var currentDispalyRow = parseInt(dispalyRow) + 1;
        outerHTML = outerHTML.replace('第 1 题', '第' + currentDispalyRow + '题');
        outerHTML = outerHTML.replace(reg, "[" + currentIndex + "]");
        $(".Items").append(outerHTML);
        form.render();
    });
</script>